.home{
    width:100%;
}
.yuantou {
    display:flex;
    height:100%;
    .wrap {
        &:nth-child(1) {
            width: calc(23% - 5px);
            margin-right: 10px;
            .panel {
                width: calc(100% - 2px);
                &:nth-child(1) {
                    height: calc(33% - 7px);
                    margin-bottom: 10px;
                } 
                &:nth-child(2) {
                    height: calc(34% - 12px);
                    margin-bottom: 10px;
                } 
                &:nth-child(3) {
                    height: calc(33% - 7px);
                } 
            }
        }
        &:nth-child(2) {
            position: relative;
            width: calc(54% - 10px);
            height: calc(100% - 2px);
            margin-right: 10px;
        }
        &:nth-child(3) {
            width: calc(23% - 5px);
            .panel {
                width: calc(100% - 2px);
                &:nth-child(1) {
                    height: calc(34% - 7px);
                    margin-bottom: 10px;
                } 
                &:nth-child(2) {
                    height: calc(33% - 12px);
                    margin-bottom: 10px;
                }  
                &:nth-child(3) {
                    height: calc(33% - 7px);
                }
            }
        }
    }
}
.weixiu{
    display:flex;
    width:100%;
    height:100%;
    .wrap {
        &:nth-child(1) {
            width: calc(60% - 5px);
            margin-right: 10px;
            height: calc(100% - 2px);
        }
        &:nth-child(2) {
            // position: relative;
            width: calc(40% - 5px);
            height: calc(100% - 2px);
            >div.dobule{
                width:100%;
                display:flex;
                height: calc(50% - 10px);
                margin-bottom:20px;
                .panel {
                &:nth-child(1) {
                    width: calc(50% - 5px);
                    margin-right:10px;
                    height: 100%!important;
                } 
                &:nth-child(2) {
                    width: calc(50% - 5px);
                    height: 100%;
                    .ranking{
                        width:100%;
                        height:40%!important;
                    }
                    .pie{
                        width:100%;
                        height:60%!important;
                    }
                } 
            }
            }
            >.panel {
                    width:100%!important;
                    height: calc(50% - 10px)!important;        
            }
        }
    }
}
.weiqi{
    display:flex;
    width:100%;
    height:100%;
    .wrap {
        &:nth-child(2) {
            width: calc(60% - 5px);
            margin-right: 10px;
            height: calc(100% - 2px);
        }
        &:nth-child(1) {
            // position: relative;
            width: calc(40% - 5px);
            height: calc(100% - 2px);
            >div.dobule{
                width:100%;
                display:flex;
                height: calc(50% - 10px);
                margin-bottom:20px;
                .panel {
                &:nth-child(1) {
                    width: calc(50% - 5px);
                    margin-right:10px;
                    height: 100%;
                } 
                &:nth-child(2) {
                    width: calc(50% - 5px);
                    height: 100%;
                    .ranking{
                        width:100%;
                        height:40%!important;
                    }
                    .pie{
                        width:100%;
                        height:60%!important;
                    }
                } 
            }
            }
            >.panel {
                    width:100%!important;
                    height: calc(50% - 10px)!important;
                 
                
            }
        }
    }
}
.jiance{
    .wrap {
        &:nth-child(2) {
            // position: relative;
            width: calc(40% - 5px);
            height: calc(100% - 2px);
            .panel {
                &:nth-child(1){
                    width:100%!important;
                    height: calc(25% - 10px)!important;
                }
                &:nth-child(2){
                    width:100%!important;
                    height: calc(75% - 10px)!important;
                } 
                 
                
            }
        }
    }
}
.jianceProject{
  display:flex;
  justify-content: space-between;
  padding:0 20px;
  height:40px;
  box-shadow: inset 0 0 20px 0 rgba(153, 204, 255, 0.1);
  p{
      line-height:40px;
      display: flex;
      span{
          cursor: pointer;
          padding:0 20px;
      }
      span.color{
          color:#f0ca61;
      }
      select{
          background:transparent;
          border:none;
          color:#fff;
          margin-left:20px;
          outline: transparent;
      }
      option{
          color:#000;
      }
  }
}
.jiance{
    height:100%;
 
    .dobule{
        display:flex;
        width:100%;
        height: calc(50% - 40px)!important;
        .pie{
            width:50%!important;
            height:100%!important;
        }
    }
    .line{
        width:100%;
        height: 50%!important;
    }
}
.fangkong{
    width:100%;
    height:100%;
    .wrap {
        &:nth-child(1) {
            width: calc(50% - 5px);

        }
        &:nth-child(2) {
            width: calc(50% - 5px);
            .three{
                display:flex;
                width:100%;
                height: calc(25% - 10px)!important;
                justify-content: space-between;
                .panel{
                    height:100%;
                    width:32%!important;
                    height:100%!important;
                    div{
                        width:100%;
                        height:100%;
                        display:flex;
                        justify-content: space-around;
                        align-items: center;
                        img{
                            width:50px;
                            height:50px;
                        }
                        p{
                            font-size:14px;
                            color:#6a9ffa;
                            span{
                                font-size:14px;
                                color:#f0ca61
                            }
                        }
                        
                    }
                }
            }
            >.panel{
                // &:nth-child(2){
                    margin-top:14px;
                // }
                
            }
        }
    }
}
